import 'package:cbec_app/components/base/base_function.dart';
import 'package:cbec_app/components/base/base_image.dart';
import 'package:cbec_app/components/base/base_interactive.dart';
import 'package:cbec_app/utils/ThemeConfig.dart';
import 'package:cbec_app/utils/Tools.dart';
import 'package:cbec_app/utils/logger.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

///商品分组导航item
class GroupNavItem extends StatefulWidget {
  ///电梯导航配置
  final Map<String, dynamic> info;

  ///导航item
  final Map<String, dynamic> item;

  ///自身索引
  final int index;

  ///激活索引
  final int curIndex;

  /// 只有一个分分组的时候，隐藏上方tab
  final bool isShow;

  ///回调分组id 索引 及 分页数量
  final Function(String id, int index, int pageSize)? callBack;

  const GroupNavItem({super.key, required this.info, required this.item, this.index = 0, this.curIndex = 0, this.callBack, required this.isShow});

  @override
  State<StatefulWidget> createState() {
    return _GroupNavItemState();
  }
}

class _GroupNavItemState extends State<GroupNavItem> {
  int _curIndex = -1;
  @override
  void initState() {
    super.initState();
    _curIndex = widget.curIndex;
    // widget.info['nav_style'] = '3';
  }

  @override
  void didUpdateWidget(covariant GroupNavItem oldWidget) {
    super.didUpdateWidget(oldWidget);
    _curIndex = widget.curIndex;
  }

  @override
  Widget build(BuildContext context) {
    return getTextStyle();
  }

  ///获取文本型样式
  Widget getTextStyle() {
    //print('获取文本型样式');
    if (widget.isShow == false) {
      return const SizedBox();
    }

    switch (widget.info['nav_style']) {
      case '1': //圆框
        return BaseInteractive(
          childWidget: Container(
            // width: getTextNeedWidth() >= getUseWidth() ? null : getItemWidth(),
            alignment: Alignment.center,
            margin: EdgeInsets.only(right: getTextNeedWidth() >= getUseWidth() ? 10 : 0),
            child: Container(
              decoration: BoxDecoration(color: widget.index == _curIndex ? ThemeConfig.themeColor : Colors.white, borderRadius: const BorderRadius.all(Radius.circular(40))),
              padding: const EdgeInsets.only(left: 10, right: 10, top: 5, bottom: 5),
              child: Text(
                widget.item['tag_name'],
                style: TextStyle(color: widget.index == _curIndex ? Colors.white : Colors.black, fontWeight: widget.index == _curIndex ? FontWeight.bold : FontWeight.normal),
              ),
            ),
          ),
          onClick: () {
            setState(() {
              _curIndex = widget.index;
              if (widget.callBack != null) {
                widget.callBack!(widget.item['id'], _curIndex, getPageSize());
              }
            });
          },
        );

      case '0': //下划线
        return BaseInteractive(
          childWidget: Container(
            width: getTextNeedWidth() >= getUseWidth() ? null : getItemWidth(),
            alignment: Alignment.center,
            child: Stack(
              children: [
                Padding(
                  padding: const EdgeInsets.only(top: 10, bottom: 10, right: 10, left: 10),
                  child: Text(
                    widget.item['tag_name'],
                    style: TextStyle(color: widget.index == _curIndex ? ThemeConfig.themeColor : Colors.black, fontWeight: widget.index == _curIndex ? FontWeight.bold : FontWeight.normal),
                  ),
                ),
                Positioned(
                    bottom: 0,
                    left: 5,
                    child: Container(
                      width: getTextWidth() + 10,
                      height: 3,
                      decoration: BoxDecoration(color: widget.index == _curIndex ? ThemeConfig.themeColor : Colors.transparent, borderRadius: const BorderRadius.all(Radius.circular(10))),
                    ))
              ],
            ),
          ),
          onClick: () {
            _curIndex = widget.index;
            if (widget.callBack != null) {
              widget.callBack!(widget.item['id'], _curIndex, getPageSize());
            }
          },
        );
      case '3': //背景
      case '2': //方框
      default:
        return BaseInteractive(
          childWidget: Container(
            width: getTextNeedWidth() >= getUseWidth() ? null : getItemWidth(),
            alignment: Alignment.center,
            child: Container(
              width: getTextNeedWidth() >= getUseWidth() ? null : getItemWidth(),
              alignment: Alignment.center,
              decoration: BoxDecoration(color: widget.index == _curIndex ? ThemeConfig.themeColor : Colors.white, borderRadius: const BorderRadius.all(Radius.circular(0))),
              padding: const EdgeInsets.only(left: 10, right: 10, top: 5, bottom: 5),
              child: Text(
                widget.item['tag_name'],
                style: TextStyle(color: widget.index == _curIndex ? Colors.white : Colors.black, fontWeight: widget.index == _curIndex ? FontWeight.bold : FontWeight.normal),
              ),
            ),
          ),
          onClick: () {
            _curIndex = widget.index;
            if (widget.callBack != null) {
              widget.callBack!(widget.item['id'], _curIndex, getPageSize());
            }
          },
        );
    }
  }

  ///获取分页数量
  int getPageSize() {
    return int.parse(widget.item['goods_number'].toString());
  }

  ///获取列表
  List getList() {
    return widget.info['sub_entry'] as List;
  }

  ///获取页面间距
  double getMargin() {
    return double.parse(widget.info['page_margin'].toString());
  }

  ///获取item宽度
  double getItemWidth() {
    return getUseWidth() / getList().length;
  }

  ///获取页面最大可用宽度
  double getUseWidth() {
    return 375.w - getMargin();
  }

  ///计算文本宽度
  double getTextWidth() {
    double initFontSize = 12;
    double initWidth = initFontSize + 3;
    return initWidth * (widget.item['tag_name'] as String).length;
  }

  ///计算文本所需列表宽度
  double getTextNeedWidth() {
    double total = 0;
    for (var item in getList()) {
      total += 15 * (item['tag_name'] as String).length + 20;
    }
    //间距
    total += (getList().length - 1) * 10;
    return total;
  }
}
